<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 导航栏 -->
    <div style="background-color: rgb(255, 253, 250);height: 25px;padding: 15px 250px;">
        <a href="./" style="text-decoration: none;color: #000;font-size: 18px"><strong>古娜拉掌管睡觉之神</strong></a>
        
    </div>

    <!-- 导航栏以下 -->
    <div style="display: flex;flex-direction: column;height: 100vh;">
        <!-- 上部分 -->
        <div style="background-color: rgb(236, 219, 241);flex: 25%;text-align: center;">
            <h1 style="margin-top: 4%;font-family: '黑体';font-size: 40px;">塔罗牌神秘屋</h1>
            <form style="margin-top: 3%;">
                <div style="display: flex;justify-content: center;">
                    <div style="display: flex;justify-content: center;align-items: center;">
                        <input placeholder="请输入您的问题" class="index_question"> 
                        <button>开始解牌</button>
                    </div>
                </div>
            </form>
            <p>尝试输入“问题”以及“你抽到的排卡以及位置”</p>


        </div>    
        <!-- 下部分 -->
        <div style="background-color: blueviolet;flex: 75%;"></div>

    </div>
</body>
</html>